//
//  CardView.swift
//  FirstApp
//
//  Created by 卓勇 on 2025/1/6.
//

import SwiftUI

struct CardView: View {
    // MARK: - Properties
    let cardData: Card
    
    // MARK: - Body
    var body: some View {
        ZStack {
            Image(cardData.imageName)
            VStack {
                Text(cardData.title)
                    .font(.largeTitle)
                    .fontWeight(.heavy)
                    .foregroundColor(.white)
                    .multilineTextAlignment(.center)
                Text(cardData.headline)
                    .fontWeight(.light)
                    .foregroundColor(.white)
                    .italic()
            }
            .offset(y: -218)
            
            Button {
                print("按钮被用户单击")
                playSound(sound: "sound-transitions", type: "mp3")
            } label: {
                HStack {
                    Text(cardData.callToAction)
                        .fontWeight(.heavy)
                        .foregroundColor(.white)
                        .accentColor(.white)
                    Image(systemName: "arrow.right.circle")
                        .font(Font.title.weight(.medium))
                        .accentColor(.white)
                }
            }
            .padding(.vertical)
            .padding(.horizontal, 24)
            .background(LinearGradient(colors: cardData.gradientColors, startPoint: .leading, endPoint: .trailing))
            .clipShape(.capsule)
            .shadow(color: Color("ColorShadow"), radius: 6, x: 3, y: 0)
            
            .offset(y: 210)

        }
        .frame(width: 335, height: 545)
        .background(LinearGradient(colors: cardData.gradientColors, startPoint: .top, endPoint: .bottom))
        .cornerRadius(16)
        .shadow(radius: 8)
    }
}

// MARK: - Preview
#Preview {
    CardView(cardData: cardDatas[0])
}
